<template>
	<view class="bg-gradient-to-b from-blue-50 to-white flex flex-col items-center justify-center min-h-screen p-6">
		<!-- 顶部标题 配置挪车信息-->
		<view class="mb-8 text-center">
			<text class="text-4xl font-bold text-blue-900">🚗 挪车助手</text>
			<text class="block mt-2 text-gray-500">快速联系车主，解决挪车问题</text>
		</view>

		<!-- 车牌信息卡片 -->
		<view class="rounded-2xl w-full max-w-sm p-6 mb-8 bg-white shadow-xl">
			<view class="flex items-center justify-center mb-4">
				<text class="text-3xl">📋</text>
			</view>

			<view>
				<xm-cell special label="输入车牌号" :value="value" @show="showKeyboard('xmKeyboard')"></xm-cell>
				<xm-keyboard-v2 ref="xmKeyboard" @confirm="confirms"></xm-keyboard-v2>
			</view>
		</view>

		<!-- 操作按钮 -->
		<view class="flex flex-col w-full max-w-sm gap-4">
			<!-- 通知车主按钮 -->
			<button
				class="rounded-xl flex items-center justify-center w-full py-4 font-semibold text-white transition-all duration-300 bg-blue-600 shadow-lg"
				@click="contact(1)"
			>
				<text class="mr-2 text-2xl">📢</text>
				<text>通知车主挪车</text>
			</button>

			<!-- 联系车主按钮 -->
			<button
				class="rounded-xl flex items-center justify-center w-full py-4 font-semibold text-white transition-all duration-300 bg-green-600 shadow-lg"
				@click="contact(2)"
			>
				<text class="mr-2 text-2xl">📞</text>
				<text>联系车主挪车</text>
			</button>
		</view>
		<view class="text-2xl fixed right-6 bottom-[10%] animate-bounce" @click="toconfigure"> ⚙️</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			phoneNumber: '',
			content: '',
			spt: '',
			value: '',
		};
	},

	onLoad() {
		console.log('vk.$fn :>> ', vk.myfn);
		this.toExamine();
		let token = vk.getToken();
		if (!token) return this.wechatLogin();
	},
	onUnload() {},
	methods: {
		async toExamine() {
			let res = await vk.callFunction({
				url: 'client/pub.index.toExamine',
			});
			vk.setVuex('toExamine', res.data);
		},
		confirms(value) {
			this.value = value;
			this.getList();
		},
		// 车牌号确认
		showKeyboard(ref) {
			this.$refs[ref].toShow(this.value);
		},
		// 获取列表
		async getList() {
			let res = await vk.callFunction({
				url: 'client/pub.index.findcarNumber',
				title: '查询中...',
				data: {
					value: this.value,
				},
			});
			if (res.data) {
				vk.toast('查询成功', 'none');
				this.phoneNumber = res.data.phoneNumber;
				this.content = res.data.content;
				this.spt = res.data.spt;
			} else {
				this.value = '';
				vk.alert('未查询到相关车主，请重写输入。');
			}
		},
		// 微信默认登录
		async wechatLogin() {
			let res = await vk.userCenter.loginByWeixin();
			this.show = true;
		},
		// 联系车主
		contact(type) {
			if (!this.value) return vk.toast('请输入车牌号后联系车主');

			type == 1 ? this.sendout() : this.call();
		},
		// 发送通知
		sendout() {
			uni.request({
				url: `https://wxpusher.zjiecode.com/api/send/message/${this.spt}/${this.content}`,
				method: 'GET',
				success: (res) => {
					if (res.statusCode == 200) {
						vk.alert('已通知成功，请稍等片刻！');
					}
				},
			});
		},
		call() {
			uni.makePhoneCall({
				phoneNumber: this.phoneNumber,
				success: (result) => {},
			});
		},
		toconfigure() {
			vk.navigateTo('/pages/index/my');
		},
	},
};
</script>
